//  <a href='item.html?pid=${pObj.pid}')">li 里面的内容</a>

console.log(location.search);
//  URLSearchParams()  构造函数  能把 获取到的 ？ 后面的值 转化成 对象
let obj = new URLSearchParams(location.search); //构造函数需要传入 ？ 后面的参数
console.log(obj.get("pid"));
let pid = obj.get("pid");

/*  根据商品 id 获取商品详情接口  productDetailAPI
接口地址：http://jx.xuzhixiang.top/ap/api/detail.php
       接口请求方式：get
       接口参数：
       id  商品的id
*/

//发起请求，获取商品 id 获取商品详情接口
axios
  .get(productDetailAPI, {
    params: { id: pid },
  })
  .then((res) => {
    let { data } = res;
    console.log(data);

    //获取到商品详情的数据
    let pObj = data.data;
    let html1 = `
        <img src="${pObj.pimg}" alt="">
    `;
    let Details2 = document.querySelector(".details2");
    Details2.innerHTML = html1;

    let html2 = `
        <h1>${pObj.pname}</h1>
        <p>￥${pObj.pprice}<a href="login.html">请登录，查看会员价</a></p>
        <span>数量：<input type="number" class="pnum-ipt" value="1"></span><br>
        <a href="cart.html"><input type="button" value="加入购物车" class="cart-add"><a>
        

    `;
    let Details3 = document.querySelector(".details3");
    Details3.innerHTML = html2;

    let cartAdd = document.querySelector(".cart-add");
    console.log(cartAdd);
    cartAdd.onclick = async function () {
      //发起请求
      /*
                    给用户购物车中添加商品 接口
                        接口地址：http://jx.xuzhixiang.top/ap/api/add-product.php
                        接口请求方式：get
                        接口参数：
                            uid  用户id
                            pid  商品id
                            pnum  要添加的商品数量                
                 */
      let uid = localStorage.getItem("uid");
      let pnumIpt = document.querySelector(".pnum-ipt");
      let pnum = pnumIpt.value;
      let params = { uid, pid, pnum };
      console.log(params);
      let { data } = await axios.get(CartAddAPI, { params });
      console.log(data);
    };
  });

//选项卡

let lis = document.querySelectorAll(".btnss li");
console.log(lis);


lis.forEach(function(li,i){
  li.onclick=function(){
    console.log(li,i);
    lis.forEach(function(li){
      li.style.backgroundColor="#f5f0f5"
    })
    lis[i].style.backgroundColor="white";
    
  }
})